let pageNo = 1
let allStr = '' //所有商品列表标签数据
//登录
function showUser() {
    //获取数据
    let user = JSON.parse(localStorage.getItem('USER'))
    if (user) {
        let headerSt = ` <p onclick="register()">${user.username}</p>
    <img src="${user.headerimg}" alt="">
    <button>退出</button>`
        $('.right').html(headerSt)
    } else {
        $('right').html(`<p onclick="register()">注册/登录</p>`)
    }
    //转换为对象
}
//搜索
function search() {

    location.href='../pages/search.html?keyword='+ $('input[type="text"]').val()
}

//退出
function logout() {
    $('.right>button').on('click', function () {
        // 1. 清除localStorage登录用户信息
        localStorage.removeItem('USER')
        $('.right>img').remove()
        $('.right>button').remove()
        // 2. 跳转到登录界面
        location.href = '../pages/index.html'
    })
}

function loadProduct(pageNo) {
    ajax({
        method: 'get',
        url: 'http://api.yuguoxy.com/api/shop/list',
        data: {
            pageSize: 8,
            pageNo
        },
        success: function (data) {
            let {
                resultCode,
                resultInfo
            } = data //解构赋值
            if (resultCode == 1) {
                let list = resultInfo.list
                console.log(list);
                showproductlist(list)

            } else {
                alert('失败')
            }

        }
    })
}

function showproductlist(list) {
    let str = list.map(item => {
        return ` <div onclick="onDetail(${item.id})">
        <img src="${item.picture}" alt="">
        <p>${item.shop}</p>
        <span>淘宝</span><span>包邮</span>
        <ul>
            <li class="color">￥${item.price}</li>
          
        </ul>
    </div>`
    }).join('')
    allStr += str
    let contents = document.querySelector('.contents')
    contents.innerHTML = allStr
}

function onMst() {
    let buttom = document.querySelector('.musm')
    buttom.addEventListener('click', function () {
        loadProduct(++pageNo)
    })

}

function onDetail(id) {
    location.href = '../pages/banner.html?id=' + id
}

function onsWiper() {
    new Swiper('.swiper', {
        autoplay: true, //可选选项，自动滑动
        loop: true, // 循环模式选项
        // 如果需要分页器
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },
        // 如果需要前进后退按钮
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    })

}

function loadBanner() {
    ajax({
        method: 'get',
        url: 'http://api.yuguoxy.com/api/shop/banner',
        success: function (data) {


            let {
                resultCode,
                resultInfo
            } = data //解构赋值
            if (resultCode == 1) {
                let list = resultInfo.list

                showBanner(list)
                // alert('成功')
            } else {
                alert('失败')
            }

        }
    })
}

function showBanner(list) {
    let str = list.map(item => {
        return `<div class="swiper-slide" ><img src="${item.url}" alt="${item.content}"></div> `
    }).join('')
    let swiperWrapper = document.querySelector('.swiper-wrapper')
    swiperWrapper.innerHTML = str
    onsWiper()
}

function register() {
   
    
        location.href = '../pages/index1.html'
    
  

}

function index1() {
    let contert = document.querySelector('.contert')
    contert.innerHTML = location.href = '../pages/index11.html'

}

function index2() {

    location.href = '../pages/index12.html'
}

function index3() {

    location.href = '../pages/index13.html'
}
$('.ul').on('click', 'li', function () {
    $('ul li').removeClass('active')
    $(this).addClass('active')
})

//回到顶部
function returns() {
    let Button = document.querySelector('.box')
    Button.onclick = function () {
        var timer = setInterval(function () {
            document.documentElement.scrollTop -= 100 //向上移动的代码
            if (document.documentElement.scrollTop == 0) {
                clearInterval(timer)
            }
        }, 50)
    }
}
loadProduct(pageNo)
onMst()
showUser()
loadBanner()

logout()
returns()